<!DOCTYPE html>
<html>

<head>
  <title></title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link href="../bootstrap-5.1.3-dist/css/bootstrap.css" rel="stylesheet">

  <script src="../bootstrap-5.1.3-dist/js/bootstrap.bundle.js"></script>
</head>

<body class="container">
  <div class="container mt-3">
    <h2>关闭提示框</h2>
    <div class="alert alert-success alert-dismissible">
      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      <strong>成功!</strong> 指定操作成功提示信息。
    </div>
    <div class="alert alert-info alert-dismissible">
      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      <strong>信息!</strong> 请注意这个信息。
    </div>
    <div class="alert alert-warning alert-dismissible">
      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      <strong>警告!</strong> 设置警告信息。
    </div>
    <div class="alert alert-danger alert-dismissible">
      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      <strong>错误!</strong> 失败的操作。
    </div>
  </div>

</body>

</html>